<template>
  <div>用户名: <input type="text" v-model="name" name="" id="" /></div>
  <div>
    每次切换要变的值: <input type="text" v-model="code" name="" id="" />
  </div>
</template>

<script lang="ts" setup>
import { ref, onMounted, onUnmounted, onActivated, onDeactivated } from "vue";
let name = ref("");
let code = ref("");

onMounted(() => {
  console.log(" name  onmouted");
});
onUnmounted(() => {
  console.log(" name onUnmounted");
});
// keep-alive  生命周期 开始和结束
onActivated(() => {
  console.log(" name onActivated");
  code.value = "";
});
onDeactivated(() => {
  console.log(" name onDeactivated");
});
</script>

<script lang="ts">
export default {
  name: "name",
};
</script>
<style>
</style>